<template>
    <div>
        <NavHeader pageUrl="user"></NavHeader>
        <div class="container userConter">
            <el-container>
                <el-aside width="200px">
                    <el-menu router class="el-menu-vertical-demo" style="border-right: none">
                        <el-menu-item index="1" route="/userProfile"> <span slot="title">个人信息</span> </el-menu-item>
                        <el-menu-item index="2" route="/userAddress"> <span slot="title">收货地址</span> </el-menu-item>
                        <el-menu-item index="3" route="/userCollect"> <span slot="title">我的收藏</span> </el-menu-item>
                        <el-menu-item index="4" route="/userOrder"> <span slot="title">我的订单</span> </el-menu-item>
                    </el-menu>
                </el-aside>
                <el-container style="padding:0 20px">
                   
                        <router-view></router-view>
                   
                </el-container>
            </el-container>
        </div>

        <service-bar></service-bar>
        <nav-footer></nav-footer>
    </div>
</template>
<script>
import ServiceBar from './../components/ServiceBar';
import NavFooter from './../components/NavFooter';
import NavHeader from './../components/NavHeader';
export default {
    name: 'order',
    components: {
        ServiceBar,
        NavHeader,
        NavFooter
    }
};
</script>
<style  scoped>
.userConter {
    padding: 20px 0;
}
.userConter .el-menu-item {
    text-align: center;
}
</style>
